//厦门大学计算机专业 | 前华为工程师
//专注《零基础学编程系列》  http://lblbc.cn/blog
//包含：Java | 安卓 | 前端 | Flutter | iOS | 小程序 | 鸿蒙
//公众号：蓝不蓝编程
<template>
    <view class="page-wrapper">
        <view class="info-container" @tap="selectAddr" :data-addr="item" v-for="(item, bindex) in dataList" :key="item.k">
            <radio :checked="selectedAddrId === item.id"></radio>

            <view class="user-info">
                <view class="user-info-row">
                    <view class="name">{{ item.name }}</view>
                    <view class="phone">{{ item.phone }}</view>
                    <view class="is-default" v-if="item.defaultAddress">默认</view>
                </view>
                <view>{{ item.address }}</view>
            </view>
        </view>
        <view class="bottom-wrapper">
            <view class="bottom-btn" @tap="gotoAddAddr">添加收货地址</view>
        </view>
    </view>
</template>

<script>
import { queryAddressList, delAddress } from '@/common/api'
export default {
    data() {
        return {
            dataList: [],
            selectedAddrId: '',
            addr: ''
        };
    },
    onLoad: function (option) {
        this.setData({
            selectedAddrId: option.id
        });
    },
    onShow: function () {
        this.queryData();
    },
    methods: {
        queryData() {
            queryAddressList().then(resp => {
            	if (!resp.data.code) {
            		this.dataList = resp.data.data
            	}
            })
        },

        gotoAddAddr() {
            uni.navigateTo({
                url: '/pages/addr/addr-add/addr-add'
            });
        },

        gotoEditAddr(e) {
            let addressId = e.currentTarget.dataset['id'];
            uni.navigateTo({
                url: '/pages/addr/addr-edit/addr-edit?id=' + addressId
            });
        },

        deleteAddr(e) {
            let addressId = e.currentTarget.dataset['id'];

            let _this = this;

            http.del(
                'mcdonalds/addrs/' + addressId,
                '',
                function (resp) {
                    _this.queryData();
                },
                function (err) {}
            );
        },

        selectAddr(e) {
            let address = e.currentTarget.dataset['addr'];
            var pages = getCurrentPages();
            var prevPage = pages[pages.length - 2]; //上一个页面
            //直接调用上一个页面的setData()方法，把数据存到上一个页面中去

            prevPage.setData({
                addr: address
            });
            uni.navigateBack();
        }
    }
};
</script>
<style>
page {
    background-color: #f4f4f4;
}

.page-wrapper {
    margin: 0;
    font-size: 28rpx;
    line-height: 1.5;
    color: #333;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
    -webkit-tap-highlight-color: transparent;
}

.info-container {
    background-color: #fff;
    border-radius: 10rpx;
    margin-top: 40rpx;
    margin-left: 20rpx;
    margin-right: 20rpx;
    padding-left: 20rpx;
    padding-right: 20rpx;
    padding-top: 20rpx;
    padding-bottom: 20rpx;
    display: flex;
    flex-direction: row;
    align-items: center;
}
.user-info {
    display: flex;
    flex-direction: column;
    flex: 1;
    margin-left: 10rpx;
}

.user-info-row {
    display: flex;
    flex-direction: row;
    align-items: center;
}
.name {
    font-size: 40rpx;
}
.phone {
    font-size: 30rpx;
    color: #999999;
    margin-left: 20rpx;
}
.is-default {
    border-radius: 10rpx;
    border: 1rpx solid #f688a3;
    padding-left: 10rpx;
    padding-right: 10rpx;
    margin-left: 20rpx;
    color: #f688a3;
}
.btn-row {
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    margin-top: 20rpx;
}

.btn {
}

.bottom-wrapper {
    position: fixed;
    bottom: 0;
    width: 100%;
}
.bottom-btn {
    font-size: 35rpx;
    color: #fff;
    margin: 50rpx 50rpx;
    background-color: #ED9220;
    border-radius: 10rpx;
    padding: 10rpx;
    display: flex;
    justify-content: center;
}
</style>
